import {
    StyleSheet,
    ImageBackground,
    Text,
    FlatList,
    ToastAndroid,
    BackHandler,
    View,
    Image,
    Button,
    Modal,
    TextInput,
    ScrollView,
    Dimensions,
    TouchableOpacity,
    PixelRatio,
    Platform,
    Share,
    Animated
} from 'react-native';
import { AntDesign } from '@expo/vector-icons';
import React, { useState, useEffect, useLayoutEffect, useRef } from 'react';

const Detail = ({ route, navigation }) => {
    useLayoutEffect(() => {
        navigation.setOptions({
            // title:route.params.id,
            headerBackVisible: true,
            headerRight: () => {
                return <AntDesign name="setting" size={24} color="black" />
            },
            headerLeft: () => {
                return <Image
                    source={require('../assets/favicon.png')}
                />
            },
            // headerTitle: ()=>{
            //   return <Button 
            //     title='center'
            //   />
            // },

        })
    }, [])
    return (
        <View>
            <Button
                title='详情页'
                onPress={() => { navigation.push('Detail', { id: 888 }) }}
            />
            <Button
                title='go Detail'
                onPress={() => { navigation.navigate('Detail', { id: 100 }) }}
            />
            <Text>详情页{route.params.id}</Text>
        </View>
    )
}
export default Detail;